import { fileURLToPath, URL } from 'node:url'
import { resolve } from 'node:path'
import fs from 'node:fs'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import VueDevTools from 'vite-plugin-vue-devtools'

import Components from 'unplugin-vue-components/vite'
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers'

import AutoImport from 'unplugin-auto-import/vite'

import { createPlugin } from 'vite-plugin-autogeneration-import-file'
const { autoImport } = createPlugin()

function pathResolve(dir: string) {
  //路径转化
  return resolve(__dirname, '.', dir)
}
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    vueJsx(),
    VueDevTools(),
    AutoImport({
      imports: ['vue', 'vue-router'], // 自动导入vue和vue-router相关函数
      dts: 'src/auto-import.d.ts' // 生成 `auto-import.d.ts` 全局声明
    }),
    Components({
      // 指定组件所在文件夹的位置，默认是src/components
      dirs: ['src/components'],
      resolvers: [
        AntDesignVueResolver({
          importStyle: 'less' // 一定要开启这个配置项
        })
      ],
      // 配置type文件生成位置
      dts: 'src/components.d.ts'
    }),
    autoImport([
      // 自动生成
      {
        // auto import components
        pattern: ['*.{vue,ts}', '**/index.{vue,ts}'], //监听的文件规则当前规则为 监听文件夹下的后缀为vue/ts子文件和 文件名为index.vue和index.ts的子孙文件
        dir: pathResolve('src/components'), //监听的文件夹
        toFile: pathResolve('types/components.d.ts'), //生成的文件
        template: fs.readFileSync(pathResolve('./template/components.d.ts'), 'utf-8'), //文件生成模板
        codeTemplates: [
          //代码模板
          {
            key: '//code',
            template: '{{name}}: typeof import("{{path}}")["default"];\n    '
          },
          {
            key: '//typeCode',
            template:
              'type {{name}}Instance = InstanceType<typeof import("{{path}}")["default"]>;\n  '
          }
        ],
        name: '_{{name}}' //组件名命名规则支持字符串模板和函数
      }
    ])
  ],
  css: {
    preprocessorOptions: {
      less: {
        modifyVars: {
          // 在这里自定义主题色等样式
          'primary-color': '#1da57a',
          'link-color': '#1da57a',
          'border-radius-base': '2px'
        },
        javascriptEnabled: true
      }
    }
  },
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  }
})
